<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-7">
  <title>Title</title>
</head>
<body>
<div class="circle">
  <div class="sector-group">
    <div class="sector"></div>
    <div class="sector"></div>
    <div class="sector"></div>
    <div class="sector"></div>
    <div class="sector"></div>
    <div class="sector"></div>
    <div class="sector"></div>
    <div class="sector"></div>
    <div class="sector"></div>
    <div class="sector"></div>
    <div class="sector"></div>
    <div class="sector"></div>
  </div>
</div>
<style>
  .circle {
    width: 300px; height: 300px;
    border-radius: 50%;
    position: relative;
    overflow: hidden;
    mask: radial-gradient(transparent 110px, #000 110px);
  }
  .sector-group {
    filter: blur(15px);
    transform: scale(1.2);
    transform-origin: 150px 150px;
  }
  .sector {
    width: 300px; height: 300px;
    position: absolute;
    clip: rect(0 300px 300px 150px);
    overflow: hidden;
  }
  .sector::after {
    content: '';
    width: 100%; height: 100%;
    background: currentColor;
    position: absolute;
    clip: rect(0 150px 300px 0);
    transform: rotate(30deg);
    border-radius: 100%;
  }
  .sector:nth-of-type(1) {
    transform: rotate(0);
    color: #f00;
  }
  .sector:nth-of-type(2) {
    transform: rotate(30deg);
    color: #f70;
  }
  .sector:nth-of-type(3) {
    transform: rotate(60deg);
    color: #ff0;
  }
  .sector:nth-of-type(5) {
    transform: rotate(90deg);
    color: #7f0;
  }
  .sector:nth-of-type(4) {
    transform: rotate(120deg);
    color: #0f0;
  }
  .sector:nth-of-type(6) {
    transform: rotate(150deg);
    color: #0f7;
  }
  .sector:nth-of-type(7) {
    transform: rotate(180deg);
    color: #0ff;
  }
  .sector:nth-of-type(8) {
    transform: rotate(210deg);
    color: #07f;
  }
  .sector:nth-of-type(9) {
    transform: rotate(240deg);
    color: #00f;
  }
  .sector:nth-of-type(10) {
    transform: rotate(270deg);
    color: #70f;
  }
  .sector:nth-of-type(11) {
    transform: rotate(300deg);
    color: #f0f;
  }
  .sector:nth-of-type(12) {
    transform: rotate(330deg);
    color: #f07;
  }
</style>
</body>
</html>